<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Homepage</title>
<style type="text/css">
	#body
	{
		background-image:url(images/main-bg.gif);
		width:960px;
		height:auto;
		margin:auto;
	}
	#head
	{
		width:98%;
		height:200px;
		margin-bottom:10px;
		padding:1%;
		border-bottom:2px solid #000;
		background-color: #09C;
	}
	
	#left
	{
		width:20%;
		height:800px;
		margin:0;
		border-top:2px solid #000;
		float:left;
		padding:1%;
		background-color:#CCC;
	}
	
	#right
	{
		width:76%;
		height:800px;
		border-top:2px solid #000;
		padding:1%;
		float:left;
	}
	
	#footer
	{
		width:98%;
		height:50px;
		padding:1%;
		margin-top:10px;
		border-top:2px solid #000;
		clear:both;
	}
	
	#cal
	{
		width:500px;
		height:300px;
		padding:10px;
		background-color:#333;
		border:2px solid #06C;
		border-radius:10px;
		-moz-border-radius:10px;
		-webkit-border-radius:10px;
	}
	
	.divcal
	{
		width:50%;
		height:auto;
		padding-top:10px;
		padding-bottom:10px;
		float:left;
	}
	
	#display
	{
		width:auto;
		height:55px;
		padding:10px;
		background-color:#CCC;
		border:2px solid #09C;
		text-align:center;
	}
	
	#displayInput {
	background-color:#FFF;
	color:#000;
	text-align:left;
	font-size:16px;
	}
	
	#displayOutput {
	background-color:#FFF;
	color:#000;
	text-align:right;
	font-size:16px;
	}
	
	.button0{
	height:auto;
	width:96px;
	} 
	
	.button1{
	height:auto;
	width:46px;
	}
	
	.button2{
	height:auto;
	width:79px;
	}
</style>
<script language="javascript" type="text/javascript">
<!--
	// global variables
	var del = '1';
	var base = '10';
	var i= 0, M = 0;
	var Ans = 0;
	
	// check reset the input display
	function checkReset(){	
		if(del == '1')
			document.form.input.value= '';
		del='0';
	}
	
	// reset form triggered from C_reset
	function formReset(){
		document.getElementById("form").reset();
		document.form.input.value = '0';
		document.form.output.value = '0';
		del = '1';
		base = '10';
		M= 0;
		disabled_button();
	}
	
	// backspace
	/*
	function back(){
		var j= 0;
		var x= document.form.input.value;
		var result= '';
		var i = x.length;
		while ((x.charAt(i-1)!= ' '))
			i--;
		for (j = 0; j< i; j++){
			result+= x.charAt(j);
		}
		return result;
	}*/

	// disable button for different base Mode
	var button = Array("C_reset", "=", "0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F", ".", "+", "-", "*", "/", "Inv", "Int", "dms", "π", "F-E", "ln", "log", "cosh", "tanh", "Exp", "(", "sin", "cos", "tan", "Mod", ")", "x^2", "x^y", "x^3", "Ans_", "n!", "x^(1/3)", "x^(1/y)", "10^x", "MC", "MR", "MS", "M+", "M-", "backspace", "CE", "±", "√", "%", "1/x");
	
	function disabled_button(){
		var i= 0;
		if(base == '2'){	
			for(i= 4; i < button.length; i++){
				document.getElementById(button[i]).disabled = true;
			}
		}
		else 
			if(base == '8'){	
				for(i= 0; i< button.length; i++){
					document.getElementById(button[i]).disabled = false;
				}
				for(i= 10; i < button.length; i++){
					document.getElementById(button[i]).disabled = true;
				}
			}
		else 
			if(base == '10'){	
				for(i= 0; i < button.length; i++){
					document.getElementById(button[i]).disabled = false;
				}
				for(i= 12; i < 18; i++){
					document.getElementById(button[i]).disabled = true;
				}
			}
		else 
			if(base == '16'){	
				for(i= 0; i< button.length; i++){
					document.getElementById(button[i]).disabled = false;
				}
				for(i= 18; i < button.length; i++){
					document.getElementById(button[i]).disabled = true;
				}
			}
	}
	

	// Base converter
	function fromDec(x, base){
		
		x= parseInt(x);
		var result= new Array();
		var r = 0;
		while (x != 0){
			r= x%base;
			if (r > 9) {
				switch (r) {
					case 10: r= 'A'; break;
					case 11: r= 'B'; break;
					case 12: r= 'C'; break;
					case 13: r= 'D'; break;
					case 14: r= 'E'; break;
					case 15: r= 'F'; break;
				}
			}
			x= parseInt(x/base);
			result.push(r);
		}
		
		// Creating final result
		result.reverse();
		var fResult= new Array();
		var i=0;
		for (i= 0; i< result.length; i++){
			fResult += result[i];
		}
		
		return fResult.toString();
	}
	
	// base builder
	function toDec(x, base){
		var i= 0;
		var result= 0;
		var n= x.length;
		var temp = "";
		
		for (i= 0; i< n; i++){
			temp = x.charAt(i);
			if (isNaN(temp)){
				switch (temp){
					case 'A': temp = '10'; break;
					case 'B': temp = '11'; break;
					case 'C': temp = '12'; break;
					case 'D': temp = '13'; break;
					case 'E': temp = '14'; break;
					case 'F': temp = '15'; break;
				}
			}
			result+= parseInt(temp)*Math.pow(base, n-1-i);
		}
		return result;
	}
	
	function baseConverter(x, base, toBase){
		if (base != toBase){
			var result= "";
			var temp= "";
			
			temp = toDec(x, base);
			result = fromDec(temp, toBase);
			
			return result;
		}
		else 
			return document.form.output.value;
	}
	// Compute factorial of x 
	function factorial(x){
		var i= 1, result= 1;
		
		for (i= 1; i<= x; i++){
			result = result* i;
		}
		return result;
	}

	// Postfix Constructor
	function InPostConverter (x){
		var splitArr= x.split(" ");
		var i= 0;
		var stack= new Array();
		//var postfix = "";
		var postfix = new Array;
		
		// Preprocess
		for (i= 0; i< splitArr.length;i++){
			if (splitArr[i]== 'Ans'){
				splitArr[i] = Ans;
			}
		}
		
		for (i= 0; i< splitArr.length; i++){

			// check if split[i] is numeric --> add to postfix
			if (!isNaN(splitArr[i])){
				//if (i != 0) {postfix += " ";}
				//postfix += splitArr[i];
				postfix.push(splitArr[i]);
			}
			
			// check if split[i] == ")" --> pop until "(" reached
			else {
				if (splitArr[i] == ")"){
					var temp = stack.pop();
					while (temp != "("){
						//postfix += " " + temp;
						postfix.push(temp);
						temp= stack.pop();
					}	
				}
				else {
					stack.push(splitArr[i]);
				}
			}
		}

		// finalize postfix
		while (stack.length != 0){
			//postfix += " " + stack.pop();
			postfix.push(stack.pop());
		}

		return postfix;
	}	

	// Postfix calculator
	function postfixCalculator (postfix){
		var splitArr = postfix;//.split(" ");
		var stack = new Array();
		var i= 0;
		for (i = 0; i< splitArr.length; i++){
			
			// check if splitArr[i] is numeric --> push in stack
			if (!isNaN(splitArr[i])){
				stack.push(splitArr[i]);
			}
			// push the result of required operations
			else {
				var a = parseFloat(stack.pop());
				//var b = stack.pop(); 
				switch (splitArr[i]){
					
					// Basic operators
					case "+": stack.push(parseFloat(a)+parseFloat(stack.pop())); break;
					case "*": stack.push(a*stack.pop()); break;
					case "-": stack.push(stack.pop()-a); break;
					case "/": stack.push(stack.pop()/a); break;
					
					// constants
					case "π": stack.push(a); stack.push(Math.PI);break;
					case "Ran": stack.push(a); stack.push(Math.random());break;
					case "M": stack.push(a); stack.push(M);break;
					//case "Ans": stack.push(a); stack.push(Ans);break;
					
					// Sin cos tan
					case "sin": stack.push(Math.sin(a));break;
					case "cos": stack.push(Math.cos(a));break;
					case "tan": stack.push(Math.tan(a));break;
					
					// Power
					//case "^2": stack.push(Math.pow(a, 2));break;
					//case "^3": stack.push(Math.pow(a, 3));break;
					case "^": stack.push(Math.pow(stack.pop(), a));break;
					case "10^": stack.push(Math.pow(10, a));break;
					case ".e+": stack.push(stack.pop()*Math.pow(10, a));break;
					
					// others
					case "√": stack.push(Math.sqrt(a));break;
					case "!": stack.push(factorial(a));break;
					case "ln": stack.push(Math.log(a)/Math.log(Math.E));break;
					case "log": stack.push(Math.log(a));break;
					case "Mod": stack.push(stack.pop() % a);break;
					case "%": stack.push(a / 100);break;
					
					//default: alert("Syntax error!");
				}
			}
		}
		return stack.pop();
	}	
	
	// Compute the displayed result
	function computeResult(x){
		postfix =  new String();
		postfix = InPostConverter(x);
		
		return postfixCalculator(postfix);
	}
-->
</script>
</head>

<body>
<div id="body">
	<div id="head">
		<img src="http://hanu.vn/templates/ja_hanu/images/logo-footer.gif" />
	</div>

    <div id="left">
        <ul style="list-style-type:square; font-size:20px;">
            <li>Homework</li>
            <li style="color:#F00">1. Quizz</li>
            <li>2. Calculator</li>
        </ul>
    </div>

    <div id="right">
        <p><b style="font-size:25px; font-style:oblique">Applications:</b> Calculator v1.0</p>
        <p>&nbsp;</p>
        <p>&nbsp;</p>
        <div id="cal"> 
        	<legend style="color:#FFF;">Calculator</legend>
            <form id="form" name="form" action="" method="post">
                <div id="display">
                	<input id="displayInput" name="input" type="text" value="0" size="60">
                    <input id="displayOutput" name="output" type="text" value="0" readonly size="60" onMouseDown="alert('Chương trình không cho phép can thiêp vào màn hình !')">
                </div>
                
                <div class="divcal">
                    <fieldset style="height:7px; font-size:15px; color:#FFF;">
                        <input type="radio" name="baseMode" value="Bin" onclick="form.output.value= baseConverter(form.input.value, base, 2), base = 2,disabled_button()" />Bin &nbsp; 
                        <input type="radio" name="baseMode" value="Oct" onclick="form.output.value= baseConverter(form.input.value, base, 8), base = 8, disabled_button()" />Oct &nbsp;
                        <input type="radio" name="baseMode" value="Dec" checked="checked" onclick="form.output.value= baseConverter(form.input.value, base, 10), base = 10, disabled_button()" />Dec &nbsp;
                        <input type="radio" name="baseMode" value="Hex" onclick="form.output.value= baseConverter(form.input.value, base, 16), base = 16, disabled_button()" />Hex &nbsp; 
                    </fieldset>
        <br />
                        <input id= "Inv"  type="button" class= "button1" value="   Inv   " />
                        <input id= "ln"  type="button" class= "button1" value="   ln    " onClick="checkReset(), form.input.value+='ln '" />
                        <input id= "("  type="button" class= "button1" value="    (    " onClick="checkReset(), form.input.value+='( '" />
                        <input id= ")"  type="button" class= "button1" value="    )    " onClick="checkReset(), form.input.value+=' )'" />
                        <br />
                        <input id= "Int"  type="button" class= "button1" value="   Int   " />
                        <input id= "log"  type="button" class= "button1" value="   log   " onClick="checkReset(), form.input.value+='log '" />
                        <input id= "sin"  type="button" class= "button1" value="   sin   " onClick="checkReset(), form.input.value+='sin '" />
                        <input id= "x^2"  type="button" class= "button1" value="   x^2   " onClick="checkReset(), form.input.value+=' ^ 2'" />
                        <br />
                        <input id= "dms"  type="button" class= "button1" value="   dms   " />
                        <input id= "cosh"  type="button" class= "button1" value="   M  " onClick="checkReset(), form.input.value+=' M'" /> 
                        <input id= "cos"  type="button" class= "button1" value="   cos   " onClick="checkReset(), form.input.value+='cos '" />
                        <input id= "x^y"  type="button" class= "button1" value="   x^y   " onClick="checkReset(), form.input.value+=' ^ '" />
                        <br />
                        <input id= "π"  type="button" class= "button1" value="    π    " onClick="checkReset(), form.input.value+='π'" />
                        <input id= "tanh"  type="button" class= "button1" value="  Ran  " onClick="checkReset(), form.input.value+=' Ran'" />
                        <input id= "tan"  type="button" class= "button1" value="   tan   " onClick="checkReset(), form.input.value+='tan '" />
                        <input id= "x^3"  type="button" class= "button1" value="   x^3   " onClick="checkReset(), form.input.value+=' ^ 3'" />
                        <br />
                        <input id= "F-E"  type="button" class= "button1" value="   F-E   " />
                        <input id= "Exp"  type="button" class= "button1" value="   Exp   " onClick="checkReset(), form.input.value+=' .e+ '" />
                        <input id= "Mod"  type="button" class= "button1" value="   Mod   " onClick="checkReset(), form.input.value+=' Mod '" />
                        <input id= "n!"  type="button" class= "button1" value="    n!   " onClick="checkReset(), form.input.value+=' !'" />
                        <input id= "Ans_"  type="button" class= "button1" value="   Ans   " onClick="checkReset(), form.input.value+='Ans'" />
                        <br />
                        <input id= "x^(1/3)"  type="button" class= "button2" value="    x^(1/3)    " onClick="checkReset(), form.input.value+=' ^ ( 1 / 3 )'" />
                        <input id= "x^(1/y)"  type="button" class= "button2" value="    x^(1/y)    " onClick="checkReset(), form.input.value+=' ^ ( 1 / '" />
                        <input id= "10^x"  type="button" class= "button2" value="     10^x      " onClick="checkReset(), form.input.value+='10^ '" />
                </div>
                <div class="divcal">
                        <input style="font-size:15px" type="button" id="MC" class= "button1" value="MC" onclick="M = 0" />
                        <input style="font-size:15px" type="button" id="MR" class= "button1" value="MR" onclick="form.input.value = 'M=', form.output.value = M, del= 1" />
                        <input style="font-size:15px" type="button" id="MS" class= "button1" value="MS" onclick="M = parseFloat(form.output.value)" />
                        <input style="font-size:15px" type="button" id="M+" class= "button1" value="M+" onclick="M += parseFloat(form.output.value)" />
                        <input style="font-size:15px" type="button" id="M-" class= "button1" value="M-" onclick="M -= parseFloat(form.output.value)" /><br /><br />
                        <input id= "backspace"  type="button" class= "button1" value="  &larr;   " onclick="back()"/>
                        <input id= "CE"  type="button" class= "button1" value="   CE  " />
                        <input id= "C_reset"  type="button" class= "button1" value="   C   " onclick="formReset()"/>
                        <input id= "±"  type="button" class= "button1" value="   ±   " />
                        <input id= "√"  type="button" class= "button1" value="   √   " onClick="checkReset(), form.input.value+='√ '" />
                        <br />
                        <input id= "7"  type="button" class= "button1" value="    7    " onClick="checkReset(), form.input.value+='7'" />
                        <input id= "8"  type="button" class= "button1" value="    8    " onClick="checkReset(), form.input.value+='8'" />
                        <input id= "9"  type="button" class= "button1" value="    9    " onClick="checkReset(), form.input.value+='9'" />
                        <input id= "/"  type="button" class= "button1" value="    /    " onClick="checkReset(), form.input.value+=' / '" />
                        <input id= "%"  type="button" class= "button1" value="    %    " onClick="checkReset(), form.input.value+=' %'" />
                        <br />
                        <input id= "4"  type="button" class= "button1" value="    4    " onClick="checkReset(), form.input.value+='4'" />
                        <input id= "5"  type="button" class= "button1" value="    5    " onClick="checkReset(), form.input.value+='5'" />
                        <input id= "6"  type="button" class= "button1" value="    6    " onClick="checkReset(), form.input.value+='6'" />
                        <input id= "*"  type="button" class= "button1" value="    *    " onClick="checkReset(), form.input.value+=' * '" />
                        <input id= "1/x"  type="button" class= "button1" value="   1/x   " onClick="checkReset(), form.input.value+=' ^ -1'" />
                        <br />
                        <input id= "1"  type="button" class= "button1" value="    1    " onClick="checkReset(), form.input.value+='1'" />
                        <input id= "2"  type="button" class= "button1" value="    2    " onClick="checkReset(), form.input.value+='2'" />
                        <input id= "3"  type="button" class= "button1" value="    3    " onClick="checkReset(), form.input.value+='3'" />
                        <input id= "-"  type="button" class= "button1" value="    -    " onClick="checkReset(), form.input.value+=' - '" />
                        <input id= "="  type="button" class= "button1" value="    =    " onClick="form.output.value = computeResult(form.input.value), del = '1', Ans = parseFloat(form.output.value)" />
                        <br />
                        <input id= "0"  type="button" class= "button0" value="    0    " onClick="checkReset(), form.input.value+='0'" />
                        <input id= "."  type="button" class= "button1" value="    ,    " onClick="checkReset(), form.input.value+='.'" />
                        <input id= "+"  type="button" class= "button1" value="    +    " onClick="checkReset(), form.input.value+=' + '" />
                        <input id= "F"  type="button" class= "button1" value="    F    " onClick="checkReset(), form.input.value+='F'" />
                        <br />
                        <input id= "A"  type="button" class= "button1" value="    A    " onClick="checkReset(), form.input.value+='A'" />
                        <input id= "B"  type="button" class= "button1" value="    B    " onClick="checkReset(), form.input.value+='B'" />
                        <input id= "C"  type="button" class= "button1" value="    C    " onClick="checkReset(), form.input.value+='C'" />
                        <input id= "D"  type="button" class= "button1" value="    D    " onClick="checkReset(), form.input.value+='D'" />
                        <input id= "E"  type="button" class= "button1" value="    E    " onClick="checkReset(), form.input.value+='E'" />
                </div>
            </form>
        </div>
    </div>

    <div id="footer">
        <p style="margin-left:400px">Copyright&copy;2012 
        <br />				&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Designed by Ki-Zero
        <br />				&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Coded by Little_Bee</p>
    </div>
</div>
</body>
</html>
